﻿<script setup xmlns="http://www.w3.org/1999/html">
import {onMounted,onUnmounted, ref, computed} from 'vue';
import {get, post,timestampToDate} from '../js/http.js'
import indexConfigDetail from '../components/modal/index_config_detail.vue'
const analyseData = ref(null)
const tabIndex = ref(0)
const detailShow = ref(false)
const currentDetail = ref({})

onMounted(() => {
  getAnalyse();
})

function getAnalyse() {
  get("/admin/getAnalyse").then(res => {
    analyseData.value = res.result
  }).catch(error => window.message("获取数据失败:"+error, 'warning'))
}

// 每10秒执行一次
const timer = setInterval(() => {
  getAnalyse();
}, 60000);

onUnmounted(() => {
  clearInterval(timer)
})
onUnmounted(() => {
  clearInterval(timer)
})
function rebuildIndex(indexInfo) {
  window.confirm("确认是否重建索引", () => {
  }, () => {
    post("/admin/indexTable", indexInfo).then(res => {
      if (res.success) {
        window.message("重建任务提交成功！", 'success')
      } else {
        window.message(res.message, 'warning')
      }
    })
        .catch(error => console.log(error))
  })
}

function detailIndex(indexInfo) {
  currentDetail.value = indexInfo
  detailShow.value = true
}

function restartIndex(indexInfo) {
  window.confirm("确认是否重启搜索服务", () => {
  }, () => {
    post("/admin/restartAll").then(res => {
      if (res.success) {
        window.message("重启成功", 'success')
      } else {
        window.message(res.message, 'warning')
      }
    })
        .catch(error => window.message(error, 'warning'))
  })
}

function restartOneIndex(indexInfo) {
  window.confirm("确认是否重新加载配置", () => {
  }, () => {
    post("/admin/restartIndex", {name: indexInfo.name}).then(res => {
      if (res.success) {
        window.message("重启成功", 'success')
      } else {
        window.message(res.message, 'warning')
      }
    })
        .catch(error => window.message(error, 'warning'))
  })
}

function forceMergeOneIndex(indexInfo) {
  window.confirm("确认是否强制合并索引，合并后会加快搜索", () => {}, () => {
    post("/admin/forceMergeIndex", {name: indexInfo.name}).then(res => {
      if (res.success) {
        window.message("合并提交成功", 'success')
      } else {
        window.message(res.message, 'warning')
      }
    })
    .catch(error => window.message(error, 'warning'))
  })
}
function formatNumber(number) {
  if (number < 10000) {
    return number.toString();
  } else if (number < 100000000) {
    return (number / 10000).toFixed(2) + '万';
  } else if (number < 100000000000) {
    return (number / 100000000).toFixed(2) + '千万';
  } else {
    return (number / 100000000000).toFixed(2) + '亿';
  }
}
function systemHandle() {
  window.confirm("是否立即GC", () => {
  }, () => {
    get("/admin/systemGC").then(res => {
      if (res.success) {
        window.message("提交成功", 'success')
      } else {
        window.message(res.message, 'warning')
      }
    }).catch(error => console.log(error))
  })
}
function runTask(task) {

}
const sortField = ref(true)
function sort(field){

    analyseData.value.index.sort((a, b) => {
      if(sortField.value){
        return a[field].localeCompare(b[field]) ;
      }else{
        return b[field].localeCompare(a[field]) ;
      }
    });
    sortField.value = !sortField.value;
}
const tabTask = computed(() => {

  if (!analyseData.value || !analyseData.value.tasks) {
    return [];
  }
  if (tabIndex.value == 1) {
    return analyseData.value.tasks.filter(item => item.type == 'SQLTask' && item.name.indexOf("重建任务") < 0);
  }
  if (tabIndex.value == 4) {
    return analyseData.value.tasks.filter(item => item.type == 'SQLTask' && item.name.indexOf("重建任务") > -1);
  }
  if (tabIndex.value == 2) {
    return analyseData.value.tasks.filter(item => item.type == 'DataChangeTask');
  }
  if (tabIndex.value == 3) {
    return analyseData.value.tasks.filter(item => item.type == 'CDCTask');
  }
  return [];

});

</script>
<template>

  <div class="container is-fullwidth" v-if="analyseData">
    <nav class="level">
      <div class="level-item has-text-centered">
        <div>
          <p class="heading has-text-grey	">索引</p>
          <p class="title">{{ analyseData.index.length }}</p>
        </div>
      </div>
      <div class="level-item has-text-centered">
        <div>
          <p class="heading has-text-grey	">数据</p>
          <p class="title">{{ formatNumber(analyseData.docCount) }}</p>
        </div>
      </div>
      <div class="level-item has-text-centered">
        <div>
          <p class="heading has-text-grey	">CPU</p>
          <p class="title">{{ analyseData.cpu }}</p>
        </div>
      </div>
      <div class="level-item has-text-centered" style="cursor: pointer">
        <div @click="systemHandle">
          <p class="heading has-text-grey	">内存</p>
          <p class="title">{{ analyseData.memory }}</p>
        </div>
      </div>
    </nav>
    <div class="tabs is-centered mt-4">
      <ul>
        <li :class="tabIndex==0?'is-active':''">
          <a @click="tabIndex=0"><span>索引信息</span></a>
        </li>
        <li :class="tabIndex==4?'is-active':''">
          <a @click="tabIndex=4"><span>重建任务信息</span></a>
        </li>
        <li :class="tabIndex==1?'is-active':''">
          <a @click="tabIndex=1"><span>SQL任务信息</span></a>
        </li>
        <li :class="tabIndex==2?'is-active':''">
          <a @click="tabIndex=2"><span>DataChange任务信息</span></a>
        </li>
        <li :class="tabIndex==3?'is-active':''">
          <a @click="tabIndex=3"><span>CDC任务信息</span></a>
        </li>
        <li :class="tabIndex==5?'is-active':''">
          <a @click="tabIndex=5"><span>数据库连接池</span></a>
        </li>
      </ul>
    </div>

    <table class="table is-fullwidth  mt-3" v-if="tabIndex==0">
      <thead>
      <tr>
        <th @click="sort('remark')" style="cursor: pointer">注释</th>
        <th @click="sort('name')" style="cursor: pointer">索引</th>
        <th>数据库</th>
        <th>数据表</th>
        <th>数据</th>
        <th>文件</th>
        <th>任务</th>
        <th style="text-align: center">操作</th>
      </tr>
      </thead>
      <tbody>
      <tr v-for="item in  analyseData.index" :key="item.Name" v-if="analyseData && analyseData.index">
        <td><a @click="detailIndex(item)">{{ item.remark }}</a></td>
        <td>{{ item.name }}</td>
        <td>{{ item.conn ? item.conn : "-"}}</td>
        <td>{{ item.table ?  item.table : "-"}}</td>
        <td>{{ formatNumber(analyseData.docs[item.name]) }}</td>
        <td><a @click="forceMergeOneIndex(item)" class="mr-3">{{ analyseData.files[item.name] }}</a></td>
        <td>{{ item.cron }}</td>
        <td style="text-align: center">
          <a @click="rebuildIndex(item)" class="mr-3">重建数据</a>
          <a @click="restartOneIndex(item)" class="mr-3">重载配置</a>
        </td>
      </tr>

      </tbody>
    </table>
  </div>

  <table class="table is-fullwidth mt-3" v-if="tabIndex!=0 && tabIndex!=5 ">
    <thead>
    <tr>
      <th>序号</th>
      <th>任务名称</th>
      <th>任务类型</th>
      <th>计划信息</th>
      <th>运行状态</th>
      <th style="text-align: center">操作</th>
    </tr>
    </thead>
    <tbody>
    <tr v-for="(item,index) in tabTask" :key="item.name">
      <td>{{ index + 1 }}</td>
      <td>{{ item.name }}</td>
      <td>{{ item.type }}</td>
      <td>{{ item.plan }}</td>
      <td>
        <span class="tag is-link" v-if="item.running">正在运行</span>
        <span class="tag is-light" v-else>触发运行</span>
      </td>
      <td style="text-align: center">
        <a @click="runTask(item)" v-if="item.type=='SQLTask'">立即运行</a>
        <span v-else class="has-text-grey-lighter">自动运行</span>
      </td>
    </tr>
    </tbody>
  </table>

  <div class=" is-fullwidth mt-3" v-if="tabIndex==5">
    <table class="table is-fullwidth" v-for="(item,index) in analyseData.conns" :key="item.serverInfo">
      <tr class="has-background-link-70"> <th colspan="6" style="color: white">数据源：{{item.serverInfo}}</th> </tr>
      <tr>
        <th>服务器信息</th>
        <td colspan="2"> {{ item.productInfo.DatabaseProductName }} {{ item.productInfo.DatabaseProductVersion }} </td>
        <th>驱动程序</th>
        <td colspan="2">{{ item.productInfo.DriverName }}</td>
      </tr>
      <tr>
        <th> 创建时间</th>
        <th> 最后使用  </th>
        <th> 验证时间  </th>
        <th> 使用中  </th>
        <th> 是否关闭  </th>
        <th> 操作</th>
      </tr>
      <tr v-if="item.connections" v-for="(conn,connIndex) in item.connections" :key="connIndex">
        <td> {{ timestampToDate(conn.createTime)}}</td>
        <td> {{ timestampToDate(conn.lastUseTime)}}  </td>
        <td> {{ timestampToDate(conn.validateTime)}}  </td>
        <td> {{ conn.busy}}  </td>
        <td> {{ conn.isClose}}  </td>
        <td> 释放</td>
      </tr>
    </table>
  </div>
  <div class="container is-flex is-justify-content-center mt-5">
    <button class="button  ml-4" @click="getAnalyse">刷新</button>
    <button class="button is-link  ml-4 is-dark" @click="restartIndex">重启搜索引擎</button>
  </div>
 <indexConfigDetail v-if="detailShow==true" @close="detailShow=false" :currentDetail="currentDetail"></indexConfigDetail>
</template>
<style scoped>
</style>
